<template>
	<view class="wrap">
		<cu-custom bgColor="bg-white" isBack="true">
			<block slot="content">修改密码</block>
		</cu-custom>
		<view class="top"></view>
		<view class="content">
			
			<u-form-item>
				<u-input type="password" v-model="newpassword" placeholder="新密码" />
			</u-form-item>
			
			<u-gap height="20"></u-gap>
			<button @click="login()" class="getSmsCode">立即修改</button>
		</view>
	</view>
</template>

<script>
	import request from '@/common/request.js';
	import storage from '@/common/storage.js';
	export default {
		data() {
			return {
				newpassword: '',
				id:0
			};
		},
		methods: {
			login(){
				let paramsList = {
					password:this.newpassword,
					id:this.id
				}
				let optsList = {
					url: 'api/user/resetPassword',
					method: 'put'
				};
				let _this = this;
				request.httpRequest(optsList, paramsList).then(res => {
					if (res.data.code == 200) {
						uni.showToast({
							title:'修改成功'
						})
						uni.clearStorageSync();
						setTimeout(()=>{
							uni.navigateTo({
								url:'/pages/index/index'
							})
						},1500)
					}else{
						uni.showToast({
							title:'修改失败',
							icon:'none'
						})
					}
				})
			}
		},
		mounted() {
			const id = uni.getStorageSync('mid')
			this.id = id
		}
	}
</script>

<style lang="scss" scoped>
	.wrap {
		font-size: 28rpx;

		.content {
			width: 600rpx;
			margin: 0 auto;
			padding-top: 80rpx;

			// .title {
			// 	text-align: left;
			// 	font-size: 60rpx;
			// 	font-weight: 500;
			// 	margin-bottom: 100rpx;
			// }

			input {
				text-align: left;
				margin-bottom: 10rpx;
				padding-bottom: 6rpx;
			}

			.tips {

				font-size: 20rpx;
				margin-bottom: 60rpx;
				margin-top: 30rpx;
			}

			.getSmsCode {
				color: #ffffff;
				background-color: rgb(30, 56, 128);

				border: none;
				font-size: 30rpx;
				padding: 12rpx 0;

				&::after {
					border: none;
				}
			}

			.alternative {
				display: flex;
				justify-content: space-between;
				margin-top: 30rpx;
			}
		}

		.bottom {
			.loginType {
				display: flex;
				padding: 260rpx 150rpx 150rpx 150rpx;
				justify-content: space-between;

				.item {
					display: flex;
					flex-direction: column;
					align-items: center;

					font-size: 28rpx;
				}
			}

			.hint {
				padding: 20rpx 40rpx;
				font-size: 20rpx;


				.link {}
			}
		}
	}
</style>